<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>我的待办</title>
    <link rel="stylesheet" href="../../../../component/pear/css/pear.css"/>
    <link rel="stylesheet" href="../../../../admin/css/reset.css"/>
</head>
<body class="pear-container">

<!-- 顶部查询表单 -->
<div class="layui-card">
    <div class="layui-card-body">
        <form class="layui-form top-search-from">
            <div class="layui-form-item">
                <label class="layui-form-label">流程名称</label>
                <div class="layui-input-block">
                    <input type="text" name="display_name" value="" class="layui-input">
                </div>
            </div>


            <div class="layui-form-item layui-inline">
                <label class="layui-form-label"></label>
                <button class="pear-btn pear-btn-md pear-btn-primary" lay-submit lay-filter="table-query">
                    <i class="layui-icon layui-icon-search"></i>查询
                </button>
                <button type="reset" class="pear-btn pear-btn-md" lay-submit lay-filter="table-reset">
                    <i class="layui-icon layui-icon-refresh"></i>重置
                </button>
            </div>
            <div class="toggle-btn">
                <a class="layui-hide">展开<i class="layui-icon layui-icon-down"></i></a>
                <a class="layui-hide">收起<i class="layui-icon layui-icon-up"></i></a>
            </div>
        </form>
    </div>
</div>


<!-- 数据表格 -->
<div class="layui-card">
    <div class="layui-card-body">
        <table id="data-table" lay-filter="data-table"></table>
    </div>
</div>


<!-- 表格行工具栏 -->
<script type="text/html" id="table-bar">
    <button class="pear-btn pear-btn-xs tool-btn" lay-event="detail" permission="wf-definition-check">处理</button>
</script>


<script src="../../../../component/layui/layui.js"></script>
<script src="../../../../component/pear/pear.js"></script>
<script src="../../../../lms/base64.js"></script>
<script src="../../../../lms/common.js"></script>
<script src="../../../../lms/permission.js"></script>
<script src="../../../../lms/config.js"></script>

<script>
    // 相关常量
    const PRIMARY_KEY = "id";
    const SELECT_API = lms_config.api_url + "/adminapi/wf/task/todolist";
    const SET_STATUS_API = lms_config.api_url + "/adminapi/wf/order/set_status";

    //没有登录退回登录页面
    if (!checkLogin()) {
        location.href = lms_config.base_path + "/login.html";
    }

    layui.use(['table', 'form', 'jquery', 'common', 'util', 'encrypt', 'popup'], function () {
            let table = layui.table;
            let form = layui.form;
            let $ = layui.jquery;
            let common = layui.common;
            let util = layui.util;
            let popup = layui.popup;
            let encrypt = layui.encrypt;

            let MODULE_PATH = "";
            let state = ['已完成', '进行中'];

            let cols = [
                // {
                //     type: 'checkbox'
                // },
                {
                    title: 'ID',
                    field: 'id',
                    align: 'center',
                    sort: true,
                    hide: true,
                    width: 60
                },
                {
                    title: '流程名称',
                    field: 'display_name',
                    align: 'left',
                    minWidth: 200,
                    templet: function (d) {
                        let processs = d['processs'] !== undefined ? d['processs'] : {};
                        return processs['display_name'] !== undefined ? processs['display_name'] : '';
                    }
                },
                {
                    title: '流程状态',
                    field: 'task_state',
                    align: 'left',
                    width: 100,
                    templet: function (d) {
                        let key = d['task_state'] !== undefined ? d['task_state'] : 0;
                        return state[key] != undefined ? state[key] : '';
                    }
                },
                {
                    title: '流程发起人',
                    field: 'operator_real_name',
                    align: 'left',
                    width: 170,
                    minWidth: 120,
                    templet: function (d) {
                        let data = d['orders'] !== undefined ? d['orders'] : {};
                        let variable = data['variable'] != undefined ? data['variable'] : {};
                        return variable['operator_real_name'] != undefined ? variable['operator_real_name'] : '';
                    }
                },
                {
                    title: '流程创建时间',
                    field: 'create_time',
                    align: 'left',
                    width: 170,
                    templet: function (d) {
                        let data = d['orders'] !== undefined ? d['orders'] : {};
                        return data['create_time'] != undefined ? data['create_time'] : '';
                    }
                },
                {
                    title: '任务创建时间',
                    field: 'create_time',
                    align: 'left',
                    width: 170
                },

                {
                    title: '操作',
                    toolbar: '#table-bar',
                    align: "left",
                    fixed: "right",
                    minWidth: 190,
                    width: 200,
                }
            ]


            window.render = function () {
                table.render({
                    elem: "#data-table",
                    url: SELECT_API,
                    page: true,
                    cols: [cols],
                    skin: "line",
                    toolbar: "#table-toolbar",
                    autoSort: false,
                    parseData: function (ret) {
                        return {
                            "code": ret.status === 200 ? 0 : -1, // 解析接口状态
                            "msg": ret.msg, // 解析提示文本
                            "count": ret.data.count, // 解析数据长度
                            "data": ret.data.list // 解析数据列表
                        };
                    },
                    defaultToolbar: [{
                        title: "刷新",
                        layEvent: "refresh",
                        icon: "layui-icon-refresh",
                    }, "filter", "print", "exports"]
                })
            }

            window.render();

            table.on('tool(data-table)', function (obj) {
                if (obj.event === 'detail') {
                    window.detail(obj);
                }
            });

            table.on('toolbar(data-table)', function (obj) {

            });

            // 头部搜索栏
            form.on('submit(table-query)', function (data) {
                table.reload("data-table", {
                    page: {
                        curr: 1
                    },
                    where: data.field
                })
                return false;
            });

            window.detail = function (obj) {
                layer.open({
                    type: 2,
                    maxmin: true,
                    title: '流程处理',
                    shade: 0.1,
                    area: [common.isModile() ? '100%' : '800px', common.isModile() ? '100%' : '450px'],
                    content: MODULE_PATH + 'detail.html?operation=add?&' + PRIMARY_KEY + '=' + obj.data[PRIMARY_KEY]
                });
            }

            /**
             * 刷新
             */
            window.refreshTable = function () {
                table.reloadData("data-table", {
                    scrollPos: "fixed"
                });
            }
        }
    )
</script>
</body>
</html>
